<!DOCTYPE html>
<html>
	<head>
		<title>益多多回收</title>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
		<link rel="stylesheet" href="${s.base}/mobile/css/weui.min.css">
		<link rel="stylesheet" href="${s.base}/mobile/css/jquery-weui.min.css">
		<link rel="stylesheet" href="${s.base}/mobile/css/base.css?123456">
        <link rel="stylesheet" href="${s.base}/mobile/css/component.css?1234545454">
	</head>

	<style type="text/css">
		html,body{background:#f5f5f5;}
		.xyg-comp-list-select{width:96%; margin: 0.2rem 2%; border-radius: 0.5rem; height:auto;}
		.xyg-comp-list-select-desc{width:100%;text-align:center;line-height:2.2rem; height:2.2rem;font-size: 0.8rem; color:#ffffff; letter-spacing: 0.01rem; border-radius: 0.2rem 0.2rem 0px 0px; background: #069AFE;border-right: 0.001rem solid #f5f5f5;border-left: 0.001rem solid #f5f5f5;}
		.xyg-comp-list-select-item{width:94%; padding:0px 3%; line-height:2.2rem; height:2.2rem;font-size: 0.8rem; color:#333333; letter-spacing: 0.01rem; background: #FFF; border: 0.001rem solid #f5f5f5;}
		.xyg-comp-list-select-item input::-webkit-input-placeholder {color: #999999;}
		.xyg-comp-list-select-item .xyg-comp-list-select-item-title{width:30%; color:#333333; height:2rem; text-align:left; float:left;}
		.xyg-comp-list-select-item .xyg-comp-list-select-item-content{width:65%; height:2rem; text-align:left; float:left;}
		.xyg-comp-list-select-item .xyg-comp-list-select-item-content input[type='text']{width:100%; height:2rem; line-height:2rem;background-color:transparent;border:0; text-align:left;}
		.xyg-comp-list-select-item .xyg-comp-list-select-item-icon{width:5%; height:2rem; text-align:center; float:left;}

		.xyg-comp-list-select-textarea{width:90%;  color:#333333;padding:0px 5%;height:13.2rem;font-size: 0.8rem;  letter-spacing: 0.01rem; background: #FFF; border: 0.001rem solid #f5f5f5;}
		.xyg-comp-list-select-textarea .xyg-comp-list-select-textarea-title{width:100%; line-height: 2rem; height:2rem; text-align:left;}
		.xyg-comp-list-select-textarea .xyg-comp-list-select-textarea-content{width:100%; height:4rem; text-align:left; float:left;}
		.xyg-comp-list-select-textarea .xyg-comp-list-select-textarea-content textarea{width:92%; padding: 0.2rem 4%; height:9.6rem; margin-bottom: 1rem; line-height:1rem;background-color:#E5E5E5;;border:0; text-align:left;}

		.xyg-comp-xy{height:2rem; line-height:2rem;width:93%; margin:0px 2% 0px 5%;}
		.xyg-bottom{width:90%; height:auto;  margin:1.5rem 5%;}
		.xyg-bottom  .xyg-btn{
			position: relative;
			background: #069AFE;
			display: block;
			margin-left: auto;
			margin-right: auto;
			padding-left: 14px;
			padding-right: 14px;
			box-sizing: border-box;
			font-size: 18px;
			text-align: center;
			text-decoration: none;
			color: #fff;
			line-height: 2.55555556;
			border-radius: 5px;
			-webkit-tap-highlight-color: rgba(0,0,0,0);
			overflow: hidden;
		}
	</style>
	<body>

	<div id="showContent">
		<div class="xyg-comp-list-select">
			<div class="xyg-comp-list-select-item">
				<div class="xyg-comp-list-select-item-title">
					联系人
				</div>
				<div class="xyg-comp-list-select-item-content">
					<input type="hidden" id="id" value="${shopAddress.id}" />
					<input type="text" id="linkName" value="${shopAddress.linkName}" placeholder="请输入联系人" />
				</div>
			</div>
			<div class="xyg-comp-list-select-item">
				<div class="xyg-comp-list-select-item-title">
					手机号
				</div>
				<div class="xyg-comp-list-select-item-content">
					<input type="text" id="phone" value="${shopAddress.phone}" placeholder="请输入手机号" />
				</div>
			</div>
			<div class="xyg-comp-list-select-item">
				<div class="xyg-comp-list-select-item-title">
					省市县
				</div>
				<div class="xyg-comp-list-select-item-content">
					<input type="text" id="name" readonly value="${shopAddress.name}" data-code="${shopAddress.districtId}"
						   data-codes="${shopAddress.provinceId},${shopAddress.cityId},${shopAddress.districtId}" placeholder="请选择省市县" />
				</div>
				<div class="xyg-comp-list-select-item-icon">
					<svg class="icon" aria-hidden="true">
						<use xlink:href="#iconxiangyou"></use>
					</svg>
				</div>
			</div>
			<div class="xyg-comp-list-select-item">
				<div class="xyg-comp-list-select-item-title">
					社区
				</div>
				<div class="xyg-comp-list-select-item-content">
					<input type="text" id="communityId" value="${shopAddress.communityName}" data-values="${shopAddress.communityId}" readonly placeholder="请选择社区" />
				</div>
				<div class="xyg-comp-list-select-item-icon">
					<svg class="icon" aria-hidden="true">
						<use xlink:href="#iconxiangyou"></use>
					</svg>
				</div>
			</div>
			<div class="xyg-comp-list-select-item">
				<div class="xyg-comp-list-select-item-title">
					详细地址
				</div>
				<div class="xyg-comp-list-select-item-content">
					<input type="text" id="descripts" placeholder="请详细地址" />
				</div>
				<div class="xyg-comp-list-select-item-icon">
					<svg class="icon" aria-hidden="true">
						<use xlink:href="#icondizhi"></use>
					</svg>
				</div>
			</div>
		</div>
		<div class="xyg-bottom">
			<a href="javascript:;" class="xyg-btn" id="showTooltips" >提交</a>
		</div>
	</div>

	</body>
	<script src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
	<script src="${s.base}/mobile/js/jquery-2.1.4.js?12132"></script>
	<script src="${s.base}/mobile/js/jquery-weui.js?12132"></script>
	<script src="${s.base}/mobile/js/component.js"></script>
    <script src="${s.base}/mobile/fonts/iconfont.js?12132"></script>
    <script src="${s.base}/mobile/js/city-picker.js"></script>
	<script src="${s.base}/mobile/js/base.js?12345454547777"></script>

	<script type="text/javascript">
		var memberId = '${memberId}';
		var status = '${status}';
		var defaultDistrictId = '${shopAddress.districtId}';

        $("#name").cityPicker({
            showDistrict: true
        });
		console.log(defaultDistrictId)
        // 判断是否有id，如果有，需要设置select
        if (defaultDistrictId != null && defaultDistrictId != "" && defaultDistrictId != undefined && defaultDistrictId != "districtId") {
            $.ajax({
                type:"post",
                url:"/phone/queryRecoveryCommunityList",
                data:{districtId:defaultDistrictId},
                async:false,
                success:function (result) {
                    var items = [];
                    var communityList = result;
                    if (communityList != null && communityList.length > 0) {
                        for (var i = 0; i < communityList.length; i++) {
                            var community = communityList[i];
                            var obj = {};
                            obj.title = community.name;
                            obj.value = community.id;
                            items.push(obj);
                        }
                    }
                    // console.log(items);
                    if (items == null || items.length == 0) {
                        $("#communityId").val("");
                        $("#communityId").attr("data-values","");
                    }
                    // update
                    $("#communityId").select("update",{
                        title: "选择社区",
                        items:items
                    });
                }
            })
		}
        // 选择社区
		function selectCommunity(districtId){
			$.ajax({
				type:"post",
				url:"/phone/queryRecoveryCommunityList",
				data:{districtId:districtId},
				async:false,
				success:function (result) {
					var items = [];
					var communityList = result;
					if (communityList != null && communityList.length > 0) {
						for (var i = 0; i < communityList.length; i++) {
							var community = communityList[i];
							var obj = {};
							obj.title = community.name;
							obj.value = community.id;
							items.push(obj);
						}
					}
					// console.log(items);
					if (items == null || items.length == 0) {
					    $("#communityId").val("");
					    $("#communityId").attr("data-values","");
					}
					// update
					$("#communityId").select("update",{
						title: "选择社区",
						items:items
					});
				}
			})

		}

        $("#showTooltips").on("click", function () {
            var linkName = $("#linkName").val();
            if (linkName == null || linkName == "") {
                $.toast("请输入联系人", "text");
                return false;
            }
            var phone = $("#phone").val();
            if (phone == null || phone == "") {
                $.toast("请输入手机号", "text");
                return false;
            }
            if (!(/^1(3|4|5|7|8)\d{9}$/.test(phone))) {
                $.toast("手机号码有误，请重填", "text");
                return false;
            }
            // 小区名称,小区主键
            var name = $("#name").val();
            if (name == null || name == "") {
                $.toast("请选择小区", "text");
                return false;
            }
            var addressIds = $("#name").attr("data-codes");
            var addressIdAttr = addressIds.split(",");
            // 社区
			var communityId = $("#communityId").attr("data-values");
			if (communityId == null || communityId == "") {
				$.toast("请选择社区", "text");
				return false;
			}
			var communityName = $("#communityId").val();
            // 详细地址
            var descripts = $("#descripts").val();
            var id = $("#id").val();
            var latitude = "";
            var longitude = "";
            var param = {
                id: id,
                memberId: memberId,
                name: name,
                linkName: linkName,
                phone: phone,
                descripts: descripts,
                provinceId: addressIdAttr[0],
                cityId: addressIdAttr[1],
                districtId: addressIdAttr[2],
				communityId: communityId,
				communityName: communityName
            };
            $.showLoading("正在提交中");
            $.post("/phone/updateOrAddAddress", param, function (result) {
                if (0 == result.code) {
                    // showLayerAlertNoRefre("操作成功！");
                    $.hideLoading();
                    $.alert("提交成功",function () {
                        goShopAddressListPageLase(memberId,status);
                    });

                } else {
                    $.hideLoading();
                    $.alert(result.msg);
                }
            }, "json");
        });
	</script>
</html>
